<template>
	<view class="info_box">
		<h1 class="tit">合同</h1>
		<text>甲方：{{contract.partyA}}</text>
		<text>统一社会信用代码：{{contract.credit_code}}</text>
		<text>乙方：{{options.name}}</text>
		<text>身份证号：{{options.idcard}}</text>
		<text>手机号：{{options.phone}}</text>
		<p v-html="data.register"></p>
		<view class="sign_box">
			<image class="sh" :src="src" mode=""></image>
			<text>甲方(盖章)：</text>
			<view style="width: 50%;display: flex;align-items: center;" class="">
				<text>乙方签字：</text>
				<image style="transform:rotate(-90deg);width: 55rpx;height: 260%;" :src="path" mode=""></image>
			</view>
			<text>法定发表人或授权代表签字：</text>
		</view>
		<h2 v-if="show == false" class="order" @click="startSign">点击签名</h2>
		<h2 v-if="show == true" class="order" @click="_change">提交</h2>
	</view>
</template>

<script>
	import message from '@/component/message.vue'
	var util = require('@/util/request.js');
	import {
		pathToBase64,
		base64ToPath
	} from '@/js_sdk/mmmm-image-tools/index.js'
	export default {
		data() {
			return {
				v: '',
				contract: {},
				data: {},
				src: '',
				path: '',
				options: {},
				show: false,
			};
		},
		onLoad(options) {
			this.options = options
			uni.setStorageSync('Path', '');
			this._getAgree()
		},
		onShow() {
			this.path = uni.getStorageSync('Path');
			if (this.path != '' && this.path != null) {
				this.show = true
			}
		},
		methods: {
			startSign() {
				uni.navigateTo({
					url: "/pages/index/agent/agent_sign"
				})
			},
			async _getAgree() {
				const userinfo = uni.getStorageSync('userinfo');
				const {
					data: res
				} = await this.$myHttp({
					url: 'v1/getAgree',
					// data: {},
					header: {
						'token': userinfo.token
					},
				});
				this.contract = res.data.contract
				this.data = res.data
				this.src = util.realm_name.substr(0, util.realm_name.length - 5) + this.contract.electronic_seal
			},
			_change() {
				let _this = this
				pathToBase64(this.path)
					.then(base64 => {
						_this.order(base64)
					})
					.catch(error => {})
			},
			async order(base) {
				const userinfo = uni.getStorageSync('userinfo');
				const {
					data: res
				} = await this.$myHttp({
					url: 'user/electronicSeal',
					data: {
						signature: base,
						name: this.options.name,
						phone: this.options.phone,
						idcards: this.options.idcard
					},
					header: {},
				});
				if (res.code == 0) {
					this.show = false
					uni.showToast({
						title: res.msg,
						duration: 1000,
						icon: "none"
					});
				} else {
					uni.$emit('show', true)
					uni.showToast({
						title: '合同签订成功！',
						duration: 3000,
						icon: "none",
						success() {
							uni.navigateBack({
								delta: 1
							});
						}
					});
					
				}

			}
		}
	}
</script>

<style lang="scss">
	.info_box {
		background-color: #efefef;
		padding: 20rpx;

		.tit {
			text-align: center;
			font-size: 32rpx;
			margin-bottom: 20rpx;
		}

		text {
			line-height: 55rpx;
			display: block;
			font-size: 28rpx;
		}

		p {
			font-size: 28rpx;
			line-height: 55rpx;
		}

		.sign_box {
			margin-top: 60rpx;
			display: flex;
			justify-content: space-between;
			flex-wrap: wrap;
			position: relative;


			text {
				min-width: 50%;
				text-align: start;
			}

			.sh {
				position: absolute;
				top: 30rpx;
				left: 33%;
				transform: translate(-50%, -50%);
				width: 240rpx;
				height: 200rpx;
			}
		}

		.order {
			padding: 30rpx;
			background-color: #00bc00;
			color: #ffffff;
			text-align: center;
			margin-top: 50rpx;
			border-radius: 10px;
		}
	}
</style>
